<div class="row" data-animation="fadeInUp-fadeOutDown">
  <div id="main-post" class="col-xs-10 col-md-8 col-md-offset-2 col-xs-offset-1 main-content">
    <% if admin_signed_in? %>
      <%= feature_post_button_for(@post) %>
    <% end %>

    <div class="pull-right">
      <%= render partial: 'posts/social_share', locals: { post: @post } %>
    </div>
    <%= render 'post_metadata', post: @post %>

    <% if @post.picture? %>
      <div class="post-picture-wrapper">
        <%= image_tag @post.picture.url(:thumb) %>
      </div>
    <% end %>

    <h3 class="title"><%= @post.title %></h3>
    <div class="body">
      <p><%= remove_javascript(@post.body).html_safe %></p>
    </div>

    <div class="post-tags">
      <% @post.tags.each do |tag| %>
        <%= link_to tag.name, tag, class: 'tag' %>
      <% end %>
    </div>

    <div class="post-stats clearfix">
      <div class="pull-left">
        <%= render partial: 'posts/likes', locals: { post: @post } %>
      </div>
      <div class="pull-left">
        <%= link_to post_path(@post, anchor: 'responses'), class: "response-icon-wrapper" do %>
          <i class="fa fa-comment-o"></i>
          <span class="response-count" data-behavior="response-count"><%= @post.responses_count %></span>
        <% end %>
      </div>

      <div class="pull-right">
        <%= render partial: 'posts/bookmarks', locals: { post: @post } %>
      </div>
    </div>

    <div class="author-info">
      <div clas="author-metadata">
        <%= avatar_for @post.user, size: 50 %>
        <div class="username-description">
          <h4><%= @post.user.username %></h4>
          <p><%= @post.user.description %></p>
        </div>
      </div>
      <%= follow_button_for @post.user %>
    </div>

    <% if user_signed_in? && current_user?(@post.user) %>
      <div class="edit-delete-button-wrapper">
        <%= link_to "Edit", edit_post_path(@post), class: 'button' %>
        <%= link_to "Delete", post_path(@post), method: :delete, class: 'button' %>
      </div>
    <% end %>
  </div>
</div> 

<div class="post-show-footer row" data-animation="fadeInUp-fadeOutDown">
  <% if @related_posts.any? %>
    <div class="col-xs-10 col-md-6 col-xs-offset-1 col-md-offset-3 main-content related-stories">
      <h4 class="small-heading">Related stories</h4>
      <% @related_posts.each do |post| %>
        <%= render partial: 'posts/post_list_item', locals: { post: post } %>
      <% end %>
    </div>
  <% end %>

  <div id="responses" class="col-xs-10 col-md-6 col-xs-offset-1 col-md-offset-3 main-content">
    <h4 class="small-heading">Responses</h4>
    <% if user_signed_in? %>
      <%= render partial: 'posts/response_editor', locals: { post: @post } %>
    <% end %>

    <div data-behavior="responses-list">
      <% if @responses.any? %>
          <%= render @responses %>
      <% end %>
    </div>
  </div>
</div>

<%= render partial: 'posts/metadata_bar', locals: { post: @post } %>
